<template>
  <div class="app-content">
    <div class="app-form">
      <Form label-position="top">
        <Row type="flex" justify="space-between">
          <Col span="11">
            <FormItem label="公司名称">
              <Input v-model.trim="editModel.enterpriseName" disabled />
            </FormItem>
          </Col>
          <Col span="11">
            <FormItem label="项目名称">
              <Input v-model.trim="editModel.projectName" disabled />
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-between">
          <Col span="11">
            <FormItem label="工点名称">
              <Input v-model.trim="editModel.constructionPointName" disabled />
            </FormItem>
          </Col>
          <Col span="11">
            <FormItem label="工点风险等级">
              <Input v-model.trim="editModel.distRiskGrade" disabled />
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-between">
          <Col span="11">
            <FormItem label="起始时间">
              <Input v-model.trim="editModel.startTime" disabled />
            </FormItem>
          </Col>
          <Col span="11">
            <FormItem label="结束时间">
              <Input v-model.trim="editModel.endTime" disabled />
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-between">
          <Col span="11">
            <FormItem label="是否在施">
              <Input v-model.trim="editModel.isWork" disabled />
            </FormItem>
          </Col>
        </Row>
        <Row>
          <Col span="24">
            <FormItem label="工点描述">
              <Input
                v-model.trim="editModel.constructionPointDescription"
                disabled
              />
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-between">
          <Col span="11">
            <FormItem label="作业风险名称">
              <Input v-model.trim="editModel.riskName" disabled />
            </FormItem>
          </Col>

          <Col span="11">
            <FormItem label="作业风险类别">
              <Select v-model="editModel.riskCategoryIds" multiple>
                <Option
                  v-for="item in riskCategories"
                  :value="item.id"
                  :key="item.id"
                  >{{ item.riskCategoryName }}</Option
                >
              </Select>
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-between">
          <Col span="11">
            <FormItem label="作业风险等级">
              <Select v-model="editModel.riskLevel">
                <Option
                  v-for="item in riskLevels"
                  :value="item.value"
                  :key="item.value"
                  >{{ item.text }}</Option
                >
              </Select>
            </FormItem>
          </Col>

          <Col span="11">
            <FormItem label="分级方法">
              <Select v-model="editModel.classificationMethodId">
                <Option
                  v-for="item in methods"
                  :value="item.id"
                  :key="item.id"
                  >{{ item.classificationMethodName }}</Option
                >
              </Select>
            </FormItem>
          </Col>
        </Row>
        <Row>
          <Col span="24">
            <FormItem label="具体风险描述">
              <Input
                type="textarea"
                maxlength="500"
                v-model="editModel.riskDescription"
              />
            </FormItem>
          </Col>
        </Row>
      </Form>
      <Row type="flex" justify="center">
        <Col>
          <Button class="mr-15" type="primary" @click="save">保存</Button>
          <Button @click="close">取消</Button>
        </Col>
      </Row>
    </div>
    <Modal v-model="isInquiries" title="业务问询" width="50%" ok-text="提交" :footer-hide="true">
      <div class="modal-content">
        <inquiries ref="isInquiriesBox" :checkedRows="checkedRows" :businessType="businessType" @modelBox="modelBox" @person="person"></inquiries>
      </div>
    </Modal>
    <Modal v-model="personModel" title="选择人" width="80%" ok-text="提交" :footer-hide="true">
      <div class="modal-content">
        <checkPerson @personBox="personBox"></checkPerson>
      </div>
    </Modal>
    <span class="inquiries" @click="replyChild()">问询</span>
  </div>
</template>

<script>
import inquiries from '../../components/modules/inquiries/index'
import checkPerson from '../../components/modules/inquiries/checkPerson'
import { mapMutations } from 'vuex'
export default {
  components:{
    inquiries,
    checkPerson
  },
  name: 'risk-identification-edit',
  props: ['id'],
  data() {
    return {
      businessType:'businesstype_identification',
      isInquiries:false,
      personModel:false,
      checkedRows:[],
      editModel: {},
      // 风险类别条目
      riskCategories: [],
      // 分级方法
      methods: [],
      //风险等级
      riskLevels: [
        { text: 'I级', value: 1 },
        { text: 'II级', value: 2 },
        { text: 'III级', value: 3 },
        { text: 'IV级', value: 4 }
      ]
    }
  },
  methods: {
    // 问询弹框
    replyChild(){
      if(this.checkedRows.length == 0){
        this.checkedRows.push(this.editModel)
      }
      this.isInquiries = true
      this.$refs.isInquiriesBox.isModel()
    },
    // 关闭问询框
    modelBox(){
      this.isInquiries = false
    },
    // 打开人员选择框
    person(){
      this.personModel = true
    },
    // 关闭人员选择框
    personBox(){
      this.personModel = false
    },
    ...mapMutations(['closeTag']),
    initModel() {
      this.$api.measurePlan
        .getRiskDetail(this.id)
        .then(({ code, data, message }) => {
          if (200 === code) {
            data.riskCategoryIds = data.riskCategoryIds
              ? data.riskCategoryIds.split(',')
              : []
            data.type = 1
            this.editModel = data
          } else {
            this.$Message.error(message)
          }
        })
    },
    // 获取风险类别
    initRiskCategories() {
      this.$api.measuresLibrary
        .getRiskCategoryFindAll()
        .then(({ code, data }) => {
          if (code === 200) {
            this.riskCategories = data
          }
        })
    },
    //分级方法
    initMethods() {
      this.$api.measuresLibrary
        .getRiskOperationClassificationMethod()
        .then(({ code, data, message }) => {
          if (code === 200) {
            this.methods = data
          } else {
            this.$Message.error(message)
          }
        })
    },
    save() {
      let copy = JSON.parse(JSON.stringify(this.editModel))
      copy.riskCategoryIds = copy.riskCategoryIds.join(',')
      this.$api.riskIdentification.edit(copy).then(({ code, message }) => {
        if (200 === code) {
          this.$Message.success('保存成功')
          this.close()
        } else {
          this.$Message.error(message)
        }
      })
    },
    close() {
      this.closeTag({
        name: this.$route.name,
        params: { ...this.$route.params },
        query: { ...this.$route.query }
      })
    }
  },
  mounted() {
    this.initModel()
    this.initRiskCategories()
    this.initMethods()
  }
}
</script>

<style lang="scss" scoped>
.app-content {
  padding: 35px 25px;
}
</style>
